<template>
    <div>
      <van-field class="input" :label="label" :type="type" :placeholder="placeholder" :rule="rule"
                 v-model="content" />
    </div>
</template>

<script>
    export default {
      data(){
        return{
          content:''
        }
      },
        props:[
          'label',
          'type',
          'placeholder',
          'rule'
        ],
      methods:{
        handleUlg(){
          const rue=new RegExp(this.rule)
          if (rue.test(this.content)){
            this.$emit("inputChange",this.content)
          }
        }
      },
      watch:{
        content(){
          this.handleUlg()
        }
      }
    }
</script>

<style scoped>
  .input{
    font-size: 3.73vw;
    line-height: 42px;
    padding: 2.67vw 2.67vw;
  }
</style>
